<template>
  <h1 ref="dom">Hello Vue3</h1>
</template>

<script>
import { onMounted, ref } from 'vue'
/* 
  目标：掌握使用ref属性绑定DOM或组件

*/
export default {
  name: 'App',
  setup() {
    console.log('setup组合API的起点')
    // this.$refs.dom
    const dom = ref(null)

    // 组件挂载完毕后，可以获取到DOM节点
    onMounted(() => {
      console.log(dom.value) // <h1></h1>
    })

    return { dom }
  },
}
</script>

<style></style>
